<template>
  <a-modal :title="title" :footer="null" :width="800" :visible="visible" :confirmLoading="confirmLoading"
    switchFullscreen @ok="handleOk" @cancel="handleCancel" cancelText="关闭">

    <a-button type="primary" icon="download" @click="handleExportXls('炼厂油品报价')">导出</a-button>
    <a-spin :spinning="confirmLoading">
      <a-table ref="table" size="middle" bordered rowKey="id" :columns="columns" :dataSource="dataSource1"
        :pagination="ipagination" :loading="loading" class="j-table-force-nowrap"
        :rowSelection="{selectedRowKeys: selectedRowKeys, onChange: onSelectChange}" @change="handleTableChange">

        <span slot="action" slot-scope="text, record">
          <a @click="handleEdit(record)">编辑</a>

          <a-divider type="vertical" />
          <a-dropdown>
            <a class="ant-dropdown-link">更多 <a-icon type="down" /></a>
            <a-menu slot="overlay">
              <a-menu-item>
                <a-popconfirm title="确定删除吗?" @confirm="() => handleDelete(record.id)">
                  <a>删除</a>
                </a-popconfirm>
              </a-menu-item>
            </a-menu>
          </a-dropdown>
        </span>

      </a-table>
      <YsyRefineryPriceEditHisModal ref="modalForm" @ok="modalFormOk"></YsyRefineryPriceEditHisModal>
    </a-spin>
  </a-modal>
</template>

<script>
  import YsyRefineryPriceEditHisModal from './modules/YsyRefineryPriceEditHisModal.vue'
  import {
    debounce
  } from 'lodash';
  import {
    httpAction,
    postAction,
    getAction,
    deleteAction
  } from '@/api/manage'
  import pick from 'lodash.pick'
  import moment from "moment"
  import JEditor from '@/components/jeecg/JEditor'
  import {
    JeecgListMixin
  } from '@/mixins/JeecgListMixin'

  export default {
    components: {
      JEditor,
      YsyRefineryPriceEditHisModal
    },
    name: "YsyRefineryPriceHistModal",
    mixins: [JeecgListMixin],
    data() {
      return {
        dataSource1: [],
        columns: [{
            title: '序号',
            dataIndex: '',
            key: 'rowIndex',
            width: 60,
            align: "center",
            customRender: function(t, r, index) {
              return parseInt(index) + 1;
            }
          },
          // {
          //   title: '炼厂id',
          //   align: "center",
          //   dataIndex: 'ysyRefineryId'
          // },
          // {
          //   title: '油品类型id',
          //   align: "center",
          //   dataIndex: 'ysyOilTypeId'
          // },
          {
            title: '价格',
            align: "center",
            dataIndex: 'price'
          },
          {
            title: '时间',
            align: "center",
            dataIndex: 'createTime'
          },
          {
            title: '操作',
            dataIndex: 'action',
            align: "center",
            scopedSlots: {
              customRender: 'action'
            },
          }
        ],
        url: {
          list: "/app/ysyRefineryPrice/queryPriceListHisPageList",
          delete: "/app/ysyRefineryPrice/delete",
          deleteBatch: "/app/ysyRefineryPrice/deleteBatch",
          exportXlsUrl: "app/ysyRefineryPrice/exportXls",
          importExcelUrl: "app/ysyRefineryPrice/importExcel",
        },
        selectList: [],
        value2: [],
        title: "报价",
        visible: false,
        model: {},
        labelCol: {
          xs: {
            span: 24
          },
          sm: {
            span: 5
          },
        },
        wrapperCol: {
          xs: {
            span: 24
          },
          sm: {
            span: 16
          },
        },
        loading: false,
        confirmLoading: false,
        form: this.$form.createForm(this),
        validatorRules: {},
        refineryId: '',
        list: [],
        oilRawMaterialIds: [],
        indexs: [],
        status: '',
        refineryItem: '',
        refineryName: '',
        selectList: [],
        selectListName: [],
        oilTypeId: '',
        type: ''
      }
    },
    created() {},
    methods: {
      handleEdit(e) {
        this.$refs.modalForm.edit(e)
      },
      modalFormOk() {
        this.loadHisData()
      },
      handleChange(e) {
        this.indexs = e
      },
      add() {
        this.edit({});
      },
      edit(oilTypeId, refineryId, type, name) {
        this.oilTypeId = oilTypeId
        this.refineryId = refineryId
        this.type = type
        this.title = name + (type == 1 ? '-优惠价' : '-挂牌价') + '-历史报价'
        this.loadHisData()
        this.visible = true
      },
      close() {
        this.$emit('close');
        this.visible = false;
        this.refineryId = ''
        this.value2 = []
        this.selectList = []
        this.selectListName = []
        this.clickFlag = true
      },
      getOilTypeByRefineryId() {
        getAction(this.url.getOilTypeByRefineryId + this.ysyRefineryId).then((res) => {
          this.selectList = res.result.map(item => item.id)
          res.result.forEach(item => {
            let obj = {
              name: item.name,
              listingPrice: '',
              preferPrice: '',
              id: item.id
            }
            this.selectListName.push(obj)
          })
          this.visible = true;
        })
      },
      handleOk() {
        this.deboseFuc()
      },
      deboseFuc: debounce(function() {
        const that = this;
        let i = 0;
        this.selectListName.forEach(item => {
          i += 1
          let params = {
            ysyRefineryId: this.ysyRefineryId,
            selectNameList: item
          }
          postAction(this.url.bjPrice, params).then((res) => {
            if (i == this.selectListName.length) {
              this.$message.success('报价成功');
              this.visible = false;
              this.selectListName = []
            }
          })
        })
      }, 1000),
      handleCancel() {
        this.close()
      },
      handleDelete(id) {
        if (!this.url.delete) {
          this.$message.error("请设置url.delete属性!")
          return
        }
        var that = this;
        deleteAction(that.url.delete, {
          id: id
        }).then((res) => {
          if (res.success) {
            that.$message.success(res.message);
            that.loadHisData();
          } else {
            that.$message.warning(res.message);
          }
        });
      },
      loadHisData() {
        let params = {
          pageNo: this.ipagination.pageNo,
          pageSize: this.ipagination.pageSize,
          ysyOilTypeId: this.oilTypeId,
          ysyRefineryId: this.refineryId,
          type: this.type
        }
        getAction(this.url.list, params).then(res => {
          this.dataSource1 = res.result.records
          this.ipagination.total = res.result.total
        })
      },
      handleTableChange() {
        this.loadHisData()
      }

    }
  }
</script>

<style lang="less" scoped>
  .flex-b {
    display: flex;
    align-items: center;
    justify-content: space-between;
  }
</style>